<!DOCTYPE html>
<html>
<head lang="en">

    <title>积分商城</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/bootstrap/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <link rel="stylesheet" href="/css/strategy.css"/>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <script src="/js/common.js"></script>
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css">
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
    <link rel="stylesheet" href="../css/shop/myshow.css">
    <script>
        function paramsMatter(value,row,index) {
            var span=document.createElement('span');
            span.setAttribute('title',value);
            span.innerHTML = value;
            return span.outerHTML;
        }

        function formatTableUnit(value, row, index) {
            return {
                css: {
                    "white-space": 'nowrap',
                    "text-overflow": 'ellipsis',
                    "overflow": 'hidden'
                }
            }
        }
    </script>
</head>

<body style="height: auto">

<div class="search-head">
    <div class="row nav-search">
        <div class="col-5">
            <a href="profiles.html">
                <span><i class="fa fa-chevron-left fa-2x"></i></span>
            </a>

        </div>
        <span style="text-align: center">我的物品</span>
    </div>
</div>
<div id="smaller">
        <!--<div style="margin-bottom: 20px">
            <a href="#">
                <div class="row news-detail">
                    <div class="col-5">
                        <img src="/upload/e6066b48-85ec-48c2-8c1d-4c2ed41fcacc.jpeg">
                    </div>
                    <div class="col-7">
                        <h4>全球最性感的海滩！</h4>
                        <p>男人女人都为之疯狂。 </p>
                    </div>
                </div>
            </a>
        <hr>
        </div>-->
</div>
<script>
    $(function () {
        var userStr = sessionStorage.getItem("user");
        var userId;
        if(userStr) {
            userId = JSON.parse(userStr).id
            $.get("/packsack",{userId:userId},function (data) {
                var html="";
                if(data){
                    $.each(data.list,function (index,ele) {
                        html+='<div style="margin-bottom: 20px">' +
                            '            <a href="#">' +
                            '                <div class="row news-detail">' +
                            '                    <div class="col-5">' +
                            '                        <img src='+ele.product.img+'>' +
                            '                    </div>' +
                            '                    <div class="col-7">' +
                            '                        <h4>'+ele.product.name+'</h4>' +
                            '                        <p>'+ele.product.intro+' </p>' +
                            '                        <span>来源:&nbsp;'+ele.sourceDisplay+'</span><br>' +
                            '                         <span>获取时间:&nbsp;'+ele.gaintime+'</span><br>' +
                            '                         <span> 发货:&nbsp;'+ele.isGetDisplay+'</span><br>' +
                            '                        <span class="gettime">'+ele.gettime+'</span>' +
                            '                    </div>' +
                            '                </div>' +
                            '            </a>' +
                            '        <hr>' +
                            '        </div>'
                    })
                    $("#smaller").append(html)
                    var time = $(".gettime")
                    $.each(time,function (index,ele) {
                        if($(ele).text()=="null"){
                            $(ele).remove();
                       }else{
                            $(ele).html("发货时间:&nbsp;"+$(ele).text());
                        }
                   })

                }
            })
        }else {
            window.location.href="/index.html";
        }
        //翻页函数
        var currentPage = 2;
        var totalPage = 2;//临时的总页数,先设值成2,防止第一次翻页无法进行
        function goPage() {
            $.get("/packsack",{userId:userId,currentPage:currentPage},function (data)  {
                //使用定义了的变量进行运算操作，必须赋予初始值

                var html='';
                $.each(data.list, function (index, ele) {
                    html+='<div style="margin-bottom: 20px">' +
                        '            <a href="#">' +
                        '                <div class="row news-detail">' +
                        '                    <div class="col-5">' +
                        '                        <img src='+ele.product.img+'>' +
                        '                    </div>' +
                        '                    <div class="col-7">' +
                        '                        <h4>'+ele.product.name+'</h4>' +
                        '                        <p>'+ele.product.intro+' </p>' +
                        '                        <span>来源:&nbsp;'+ele.sourceDisplay+'</span><br>' +
                        '                         <span>获取时间:&nbsp;'+ele.gaintime+'</span><br>' +
                        '                         <span> 发货:&nbsp;'+ele.isGetDisplay+'</span><br>' +
                        '                        <span class="gettime">'+ele.gettime+'</span>' +
                        '                    </div>' +
                        '                </div>' +
                        '            </a>' +
                        '        <hr>' +
                        '        </div>'
                });
                //拼接在全部攻略对应的div中
                $(".smaller").append(html);
                currentPage+=1;
                totalPage = data.pages;
            }, "json")
        }
        //滑动分页事件
        //监视屏幕滚动，到达页尾开始翻页
        $(window).scroll(function () {
            //在推荐页时不进行操作
            console.log(1);
            if ($(window).height() + $(window).scrollTop() +1>= $(document).height()) {
                //防止无限翻页
                console.log(2);
                if (currentPage <= totalPage) {
                    console.log("翻页");
                    //加载第二页的数据
                    goPage();
                }
            }
            //数据加载完毕，停止翻页
            if ($(window).height() + $(window).scrollTop() +1>= $(document).height() & currentPage > totalPage) {
                $(document).dialog({
                    type: 'notice',
                    infoText: '到底啦，扑街仔！',
                    autoClose: 2500,
                    position: 'bottom'  // center: 居中; bottom: 底部
                });
            }
        })
    })
</script>
</body>
</html>